<template>
	<div>
		<!-- 添加按钮 -->
		<el-row>
			<el-col>
				<el-button type="primary" size="mini" :disabled="IsShowAddbtn" @click="IsShowAdd=true">添加属性</el-button>
			</el-col>
		</el-row>
		<el-table :data="tableData" style="width: 100%">
			<el-table-column type="expand">
				<template slot-scope="props">
					<!-- 标签的控件 -->
					<nature :NatureList='props.row.natureList' :ParamID="props.row.id"></nature>
				</template>
			</el-table-column>
			<el-table-column label="编号" prop="id"></el-table-column>
			<el-table-column label="参数名称" prop="paramName"></el-table-column>
			<el-table-column label="操作" prop="desc">
				<template slot-scope="scope">
					<el-button type="primary" size="mini" @click="editParams(scope.row.id)">编辑</el-button>
					<el-button type="danger" size="mini" @click="delParams(scope.row.id)">删除</el-button>
				</template>
			</el-table-column>
		</el-table>
		<addParams
			:dialogVisible="IsShowAdd"
			:titleName="'静态属性'"
			:CateID="this.CateID"
			:Type="1"
			@IsShowDialdg="IsShowAddDialog"
			@dateupdata="dateupdata"
		></addParams>
		<editParams
			:dialogVisible="IsShowEdit"
			:titleName="'动态参数'"
			:ID="this.ID"
			@IsShowDialdg="IsShowEditDialog"
			@dateupdata="dateupdata"
		></editParams>
	</div>
</template>

<script>
import addParams from './AddParams'
import editParams from './EditParams'
import nature from './ParamsNature'
export default {
	props: {
		IsShowAddbtn: {
			type: Boolean,
			default: true
		},
		tableData: {
			type: Array,
			default: []
		},
		//分类的ID
		CateID: {
			type: parseInt,
			default: 0
		}
	},
	components: {
		addParams,
		editParams,
		nature
	},
	data() {
		return {
			IsShowAdd: false,
			IsShowEdit: false,
			ID: 0
		}
	},
	methods: {
		//同步IsShowAdd
		IsShowAddDialog(data) {
			this.IsShowAdd = data.IsShow
        },
        //同步IsShowEdit
		IsShowEditDialog(data) {
			this.IsShowEdit = data.IsShow
		},
		//同步数据
		dateupdata() {
			this.$emit('dateupdata')
		},
		//修改
		editParams(id) {
			console.log(id)
			this.ID = id
			this.IsShowEdit = true
			console.log(this.IsShowEdit)
		},
		//删除
		delParams(id) {
			this.$confirm('是否确定删除此记录？', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			})
				.then(() => {
					this.$get('/api/Params/DelParams', {
						ID: id
					})
						.then(res => {
							if (res.code == 0) {
								this.$emit('dateupdata')
								this.$message({
									message: res.msg,
									type: 'success'
								})
							} else {
								this.$message.error(res.msg)
							}
						})
						.catch(err => {
							console.log(err)
						})
				})
				.catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					})
				})
		}
	}
}
</script>